<template>
	<el-main class="nopadding" style="overflow: hidden; margin: 15px 0px;">
		<el-row :gutter="15">
			<el-col :lg="24">
				<el-card shadow="never" style="margin: 0px; padding: 0px;">
					<jdEcharts height="300px" :option="option"></jdEcharts>
				</el-card>
			</el-col>
		</el-row>
	</el-main>
</template>

<script>
	import jdEcharts from '@/components/jdEcharts';

	/**
	 * 引入组件 @/components/scEcharts
	 * 组件内部会自动加载主题 @/components/scEcharts/echarts-theme-T.js
	 * 支持props包括 height，width，option
	 * 组件export百度Echarts所有方法，使用方式: new scEcharts[fun]
	 */

	export default {
		name: 'chart',
		title: "数据总览",
		icon: "el-icon-data-line",
		description: "",
		components: {
			jdEcharts
		},
		props:{
			data:Object
		},
		data() {
			return {
				option: {
					title: {
						text: '数据总览',
						subtext: '各子模块的数据汇总',
					},
					tooltip: {
						trigger: 'item',
						confine: true,
					},
					radar: {
						radius: 100,
						center: ['50%', '55%'],
						indicator: [
							{ name: '表单', max: 30},
							{ name: '流程', max: 30},
							{ name: '模型', max: 30},
							{ name: '接口', max: 30},
							{ name: '角色', max: 30},
							{ name: '开发', max: 30}
						]
					},
					series: [{
						name: "数据总览",
						type: 'radar',
						areaStyle: {},
						data: [
							{
								value: [5, 1, 8, 6, 2, 0],
							}
						]
					}]
				},
			}
		},
		watch:{
			data:{
				handler(){

					if (typeof(this.data.modelData) !='undefined' && this.data.modelData.length >0){
						 this.option.series[0].data[0].value =this.data.modelData;
					}
				},
				deep:true

			}
		},
		mounted() {

		},
		methods: {

		},
		beforeUnmount() {

		}
	}
</script>

<style lang="scss">

</style>
